<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>登录</title>
    <meta name="description" content="description">
    <meta name="author" content="Evgeniya">
    <meta name="keyword" content="keywords">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/plugins/bootstrap/bootstrap.css" rel="stylesheet">
    <!--		<link href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" rel="stylesheet">-->
    <!--		<link href='http://fonts.googleapis.com/css?family=Righteous' rel='stylesheet' type='text/css'>-->
    <link href="/css/style_v1.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
<!--				<script src="http://getbootstrap.com/docs-assets/js/html5shiv.js"></script>-->
    <!--				<script src="http://getbootstrap.com/docs-assets/js/respond.min.js"></script>-->
    <![endif]-->
    <script src="/plugins/jquery/jquery.min.js"></script>
</head>
<body>
<div class="container-fluid">
    <div id="page-login" class="row">
        <div class="col-xs-12 col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3">
            <div class="text-right">
                <a href="register" class="txt-default">Need an account?</a>
            </div>
            <div class="box">
                <div class="box-content">
                    <div class="text-center">
                        <h3 class="page-header">Spring-shiro Login Page</h3>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Username</label>
                        <input type="text" id="username" class="form-control" name="username"/>
                    </div>
                    <div class="form-group">
                        <label class="control-label">Password</label>
                        <input type="password" id="password" class="form-control" name="password"/>
                    </div>
                    <div class="form-group">
                        <div class="checkbox">
                            <label class="control-label"><b>Remember me</b>
                                <input type="checkbox" id="remember" checked>
                                <i class="fa fa-square-o"></i>
                            </label>
                        </div>
                    </div>
                    <div class="text-center">
                        <button id="login" class="btn btn-primary">login</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    $(document).ready(function () {
        $("#login").click(function () {

            var json = {
                "code": $("#code").val(),
                "username": $("#username").val(),
                "password": $("#password").val(),
                "rememberme": document.getElementById("remember").checked
            };
            $.ajax({
                url: "/loginvalidate",
                type: "POST",
                data: JSON.stringify(json), //转JSON字符串
                dataType: 'json',
                contentType: 'application/json;charset=UTF-8', //contentType很重要
                success: function (jsonstr) {
                    if (jsonstr.state == "login success") {
                        window.location = "/html/index";
                    } else
                        alert(jsonstr.state);
                }
            });
        });
    });
</script>